div class="clear" 但是占用高度,怎么办?

来源:百度知道 编辑:UC知道 时间:2024/05/17 22:00:11
在前面有两个float:left的div,然后接着一个<div class="clear"></div>,CSS中的写:.clear {clear:both; }接着还有一个div。在IE8中正常,但IE6,IE7中这个clear的div始终占用一个高度把下面那个div顶到下面了。
在网上搜,有人说加上height:0px; font-size:0px; line-height:0px; 还有人用 height:1px; margin-top:-1px;各种各样的都试过了,但是都没用,还是有高度。
但是很诡异的是这个高度在IE8的开发人员工具里看不到(理论上讲一个div如果有高度,在开发人员工具里可以看到蓝色的框,但是这个没有蓝色的框)。
请教有丰富经验的大侠告诉我这个问题的完美的解决方法,注意是IE6,IE7哦~~

首先纠正一下,那不是占用高度,clear:both的意思,你从字面上来看就应该清楚,说白了,就是清除左右两边的元素。所以,它下面的代码才会在它下面。

不理解为什么你喜欢钻牛角尖,如果你想实现和IE8一样的效果,不让它在下面,你把<div class="clear"></div>删除不就完事了,或者删除 class="clear"或者删除css代码。

还是我没理解你说的意思,你的意思是说上下两个DIV之间有缝隙?

在clear:both;后面加float:left;或者在它下面的那个DIV加上float:left;

我不清楚你理解为什么会出现IE6,7,8吗

当浏览器诞生的时候,还没有W3C组织,微软秉持一贯作风,即使后来出现WEB标准后它仍然使用自己“独特”的方式开发,没有遵循业界标准。大家都知道Firefox占的份额越来越大,它的诸多优点让IE不得不从良。不管发展到IE几,你设计的方向绝对应该向Firefox靠齐,它才是标准。

我也遇到此问题,把最终代码给你
.clear
{
height:0;
font-size:0;
clear:both;
over-flow:hidden;
}
这样就可以了

如果有高度或者是错位的情况下,你可以把clear移除看看是不是这个地方的问题。
1、看看结尾是否正常。
2、设置有问题。(因为一般的clear是不会这样的即使是IE8)